/*
 * Any rules which should not be flipped automatically in right-to-left situations should be
 * prepended with @noflip in a comment block. Images that should be embedded as base64 data-URLs
 * should be prepended with @embed in a comment block.
 * 
 * This style-sheet employs a few CSS trick to accomplish compatibility with a wide range of web
 * browsers. The most common trick is to use some styles in IE6 only. This is accomplished by using
 * a rule that makes things work in IE6, and then following it with a rule that begins with
 * "html > body" or use a child selector ">", which is ignored by IE6 because it does not support
 * the child selector. You can spot this by looking for the "OVERRIDDEN BY COMPLIANT BROWSERS" and
 * "IGNORED BY IE6" comments.
 */
/* GT4DC changes for mobile */
/**************************************************/
/** table.decorated - basic table DC format      **/
/**                                              **/
/**************************************************/
table.decorated {
  background-color:#D0F5CB;
  border-collapse:collapse;
  border-spacing:0px;
  width:100%;
  border:2px solid #006500;
  align:center;
  margin-left:auto;
  margin-right:auto;
}
table.decorated td {
  border:   2px solid #006500;
  padding:  6px;
}
table.decorated thead,.thead {
  color:            #FFFFFF;
  background-color: #339900;
  border:           2px solid #006500;
  border-collapse:  collapse;
  font-weight:      bold;
  text-align:       center;
}
table.labelled td:before {
  display:  none;
}
@media  only screen and (max-width: 790px){
  .noprint{display:none}
  #footer{display:none !important;}
  #mw-pages{display:block;}
  #Related_Content{display:none !important;}
  #catlinks{display:none !important;}
  .editsection{display:none !important;}
  html,body{padding-left:0em !important;}
  div#mw-page-base{height:5em !important}
  div#mw-page-base:before{content:"MENU";background-color:green;color:white;}
  #mw-page-base{display:block;}
  #mw-head{display:block;top:1.5em !important;}
  div#left-navigation{left:0 !important;}
  #p-personal{left:0 !important;}
  #p-personal ul{padding-left:0 !important;}
  div#p-search{position:absolute;top:1em;}
  div#right-navigation{width:18em !important;}
  #searchGoButton{display:none !important;}
  div#bodyContent{font-size:inherit !important}
  div#p-views{position: absolute;right: 1.5em;}
  div#p-cactions{position: absolute;right: 0em;}

  div#content{margin-top:1.5em}

  #p-logo{display:none;}
  div#mw-panel{display:none;
            top:1.5em !important;
            background-color:white !important;
            border:1px solid green !important;
          }
  div#mw-panel ul,li {font-size:1em !important;}
}
@media  only screen and (max-width: 760px){
  /* Force table to not be like tables anymore */
  table.collapsing thead,.thead, table.collapsing tbody, table.collapsing th{
    display: block; 
  }

  /* remove table borders */
  table.collapsing {
    display:  block; 
    border:   0;
    width:    95%;/*use more width on small screen */
  }

  /* Hide table headers (but not display: none;, for accessibility) */
  table.collapsing thead tr,.thead{ 
    position: absolute;
    top:      -9999px;
    left:     -9999px;
  }
  
  /* remove table header borders */
  table.collapsing thead,.thead { 
    border:   0;
  }
  
  /* Table rows will turn into mini tables in effect */
  table.collapsing tr{  
    display:        block; 
    border:         10px solid #fff; 
    padding-bottom: 00px;
  }
  
  /* With rows acting like tables each cell */
  /* in a row will behave  like a "row" */
  table.collapsing td{
    display:      block; 
    border:       2px solid #006500;
    position:     relative;
    padding-left: 0px; 
    padding-right:0px; 
    text-align:   center;
    overflow-x:   auto;
    overflow-y:   hidden;
    width:        inherit;
  }
/*******************************************************************/
/* add this class to add a label for each row in a collapsed table */
/*******************************************************************/
  /* Now like a table header  but applied to each row */
  table.labelled td:before {
    display:block;
    position: absolute;
    vertical-align:middle;
    /* Top/left values mimic padding */
    top: 0px;
    left: 0px;
    width: 100px;
    height:100%;
    padding-right: 0px;
    padding-top: 0px;
    margin-bottom: 6px;
    background-color:#339900;
    color: white;
    font-weight:      bold;
  }
}


div#toolbar,
div#toolbar img{display:inline;padding-left:5px;}
/* Framework */
.decorated .tright{float:none;}
.decorated div.thumbinner{margin-left:auto;margin-right:auto;}
/*
@media  only screen and (max-width: 791px){
div#mw-panel{display:block}
}
*/

@media  only screen and (max-width: 500px){
  #mw-pages{display:none !important;}
  li#pt-mycontris{display:none}
  li#pt-watchlist{display:none}
  #ca-history{display:none}
}
